<%@ page import="photobox.photo.Photo; photobox.account.User" %>
<g:render template="../home/header" ></g:render>
<script>
//    window.onload=function(){
//        alert('eeeeeeeeeeeeeeeee')
//    }
    function updateOrderItem(itemId, type){
        //diminish 减

        if(type != 'del'){
            $.ajax(
                    {
                        type: "POST",
                        url: "<g:createLink controller="order" action="orderItemsChange "/>",
                        data: {itemId:itemId,type:type},
                        dataType: "json",
                        success: function (data) {

                            $("#amount_"+itemId).val(data.number);
                            $("#tprice_"+itemId).html(data.tprice);
                            $("#yprice_"+itemId).html(data.yunPrice);
                            $("#Tprice_"+itemId).html(data.TPrice);
                            if(type == 'add'){
                                var m = parseInt($("#totalPrice").html()) + data.price+10;
                                $("#totalPrice").html(m);
                            }else if(type == 'diminish' && parseInt( $("#amount_"+itemId).val()) >=1 ){
                               // alert(parseInt( $("#amount_"+itemId).val()));
                                var m = parseInt($("#totalPrice").html()) - data.price-10;
                                $("#totalPrice").html(m);
                            }
                            //window.location.reload();
                        },
                        error: function (data, status, e)//服务器响应失败处理函数
                        {
                            alert("至少选择一件");
                        }
                    }
            );
        }else if(type == 'del'){
            if(confirm("确定删除？")){
                $.ajax(
                        {
                            type: "POST",
                            url: "<g:createLink controller="order" action="orderItemsChange"/>",
                            data: {itemId:itemId,type:type},
                            dataType: "json",
                            success: function (data) {
                                $("#item_"+itemId).remove();
                                var m = parseInt($("#totalPrice").html()) - data.tprice;
                                $("#totalPrice").html(m);

                            },
                            error: function (data, status, e)//服务器响应失败处理函数
                            {
                                alert(e);
                            }
                        }
                );

            }
        }
    }
    function clearCart(type){
        $.ajax(
                {
                    type: "POST",
                    url: "<g:createLink controller="order" action="clearCart"/>",
                    data: {type:type},
                    dataType: "json",
                    success: function (data) {
                        if(data.isClear == 'isClear'){
                            //$("#item_"+1).remove();
                            $("#items").remove();
                            $("#totalPrice").html(0);
                            //alert(2222222222222);
                        }
                    },
                    error: function (data, status, e)//服务器响应失败处理函数
                    {
                        alert(e);
                    }
                }
        );
    }
</script>
<!--主体-->

<div class="wid_1200 mTo_20">
    <div class="f_l">
        <div class="left_blk mBo_20 load_blk_ying">
            <div class="user_blk">
            <!--
            <div class="user_head"><img src="../${member?.photoImage}" alt="头像"></div>-->
                <g:if test="${session.userId}">
                    <div class="user_head"><!--<div class="user_head"><img src="../${user?.photoImage}" alt="头像"></div>-->
                        <g:if test="${photobox.account.User.get(session.userId)?.photoImage}">
                            <img src="../${User.findById(session.userId)?.photoImage}"  alt="头像" />
                        </g:if>
                        <g:else>
                            <a href="#" class="dropdown-toggle" data-toggle="dropdown"><img src="${resource(dir: '/assets/img', file: 'headp_140.jpg')}" alt="photobox" class="userPic"></a>
                        </g:else>
                    </div>
                </g:if>
            </div>
            <!--nav-->

            <div class="nav_left bor1" style=" height:108px;">
                <ul class="">
                    <li><g:link controller="member" action="browserHistory">我浏览的作品</g:link></li>
            <li><g:link controller="member" action="purchasedPhoto">我购买的作品</g:link></li>
        </ul>
        </div>
            <!--/nav-->
        </div>
        <!--/用户简介-->
        <div class="left_blk pBo_20">
            <div class="sJiao"><div class="jiao1"></div></div>
            <div class="user_jianj">
                <p>${User.findById(session.userId)?.presentation}</p>
            </div>
        </div>
        <!--/用户简介-->
        <div class="kong_100 clear"></div>
    </div>


    <!--blk3-->
    <div class="blk3 f_r load_blk_ying load1">
        <div class="crumbs mLe_20">
            <span>订单详情</span><em class="tubiao2">&nbsp;</em><span>购物车</span>
        </div>
        <!--购物车-->
        <div class="blk3_1 mTo_20">
            <div class="table_qu">
                <table class="table1" width="100%">
                    <thead>
                    <tr>
                        <th width="10%">序号</th>
                        <th width="15%">商品名称</th>
                        <th width="13%">价格</th>
                        <th width="15%">购买数量</th>
                        <th width="9%">运费</th>
                        <!--<th width="9%">纸张价格</th>
                        <th width="9%">包装价格</th>-->
                        <th width="10%">小计</th>
                        <th width="10%">操作</th>
                    </tr>
                    </thead>
                    <tbody  id="items">
                    <tr>
                        <g:each in="${session.orderItems}"  status="i" var="it">

                            <tr id="item_${it.itemId}">
                                <td >${it.itemId+1}</td>
                                <td ><a href="#">${Photo.get(it.photoId)?.name}</a></td>

                                <td class="td4" id="tprice_${it.itemId}">${Math.round(it.eachPrice)}</td>
                                <td class="td1">
                                    %{--<input id="num_${it.number}" name="" type="text" value="${it.number}" style=" width:30px; text-align:center; border:1px solid #ccc;" />--}%
                                    <input type="text" value="${it.number}" class="num_txt f_l" id="amount_${it.itemId}" pattern="[0-9]*"/>
                                    <span class="num_gai f_l">
                                        <input name="" onclick="updateOrderItem(${it.itemId}, 'add')" style="" class="num_add" type="button" value="∧" />
                                        <input name="" onclick="updateOrderItem(${it.itemId}, 'diminish')" style="" class="num_min" type="button" value="∨" />
                                    </span>
                                </td>
                                <td id="yprice_${it.itemId}">10</td>

                              <!--  <td>${Math.round(it.paperPrice)}</td>
                                <td>${Math.round(it.packingPrice)}</td>-->

                                <td id="Tprice_${it.itemId}">${Math.round(it.totalPrice)}</td>
                                <td><a href="javascript:void(0);" onclick="updateOrderItem(${it.itemId}, 'del')" class="shchu">&nbsp;</a></td>
                            </tr>
                        </g:each>
                    </tr>
                    </tbody>
                </table>
                <div class="kong_20"></div><div class="kong_20"></div>
                <div cellpadding="0" cellspacing="0" class="gwc_tb3" style=" border: 0; background: #f2f2f2; height: 76px; line-height: 76px; overflow: hidden;">
                    <div class="tb3_td3 f_l">合计:<strong>￥</strong><em style=" color:#f00;" id="totalPrice">${Math.round(totalPrice)}</em></div>
                    <div class="tb3_td4 f_r" style="margin: 10px 20px 0 0"><g:link controller="order" action="buyAddress" class="annui annui1"> 结算</g:link></div>
                    <div class="annui5 f_r" style="margin: 20px 20px 0 0"><a href="javascript:void(0);" onclick="clearCart('clear')">清空购物车</a></div>
                </div>

            </div>
        </div>
        <!--/购物车-->

        <div class="bottomBor"></div>%{--遮住底部阴影--}%
    </div><!--/blk_3-->

</div>
<!--/主体-->

<g:render template="../home/footer" ></g:render>


